<%--
  Created by IntelliJ IDEA.
  User: smile
  Date: 2021/11/1
  Time: 21:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>$Title$</title>
  </head>
  <script type="text/javascript">
    function test() {
      //发送异步请求
      //1、创建XMLHttpRequest对象
      var xmlhttp;
      if(window.XMLHttpRequest){
        //非IE
        xmlhttp = new XMLHttpRequest();
      }else if(window.ActiveXObject){
        //IE
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      }
      //2、打开链接
      var uname = document.getElementById("uname").value;
      // xmlhttp.open("get","/testuname?username="+uname,true)
      xmlhttp.open("post","/testuname",true);
      //3、指定回调函数
      xmlhttp.onreadystatechange=function () {
        //3.1 判断状态
        if(xmlhttp.readyState==4) {
          //3.2 接收返回的数据
          var responseText = xmlhttp.responseText;
          document.getElementById("rs").innerText=responseText;
        }
      }
      //4、发送数据
      // xmlhttp.send();
      //post
      xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded;charset=UTF-8");
      xmlhttp.send("username="+uname);
    }
  </script>

  <body>
    <h1>index.jsp</h1>
    username：<input type="text" id="uname" onblur="test()"><span id="rs"></span>

  </body>
</html>
